<template>
  <div class="manualOrder">
    <c-title :hide="false" text="手动下单"></c-title>
    <div class="textAuth">操作权限：<span class="txt_btn" v-for="(item,index) in AuthText" :key="index">{{item}}</span></div>
    <van-search v-model="searchVal" placeholder="搜索订单号" @search="searchMehtod" />
    <van-tabs v-model="active" title-active-color="#FE5E56" color="#FE5E56" @change="tabsChange">
      <van-tab :title="item.title" v-for="(item, index) in tabArr" :key="index"></van-tab>
    </van-tabs>
    <div class="lis">
      <manualOrderList :listInfo="listInfo" @resetGetData="tabsChange" />
    </div>
  </div>
</template>
<script>
import manualOrderList from "./components/manualOrderList.vue";
import { scrollMixin } from "utils/mixin";
export default {
  mixins: [scrollMixin], //加载更多
  data() {
    return {
      tabArr: [],
      active: 0,
      listInfo: {},
      page: 1,
      current_page: 0,
      isLoadMore: true,
      searchVal: "",
      AuthText: []
    };
  },
  components: {
    manualOrderList
  },
  mounted() {
    this.getListBar();
  },
  methods: {
    async searchMehtod() {
      this.init();
      await this.getData();
    },
    tabsChange() {
      this.init();
      this.getData();
    },
    init() {
      this.page = 1;
      this.total_page = 0;
      this.isLoadMore = true;
      this.listInfo = [];
    },
    async getListBar() {
      let data = await $http.post("plugin.manual-order.frontend.order.listBar", {});
      // console.log(data,'datadatadatadata');
      if (data.result) {
        this.tabArr = data.data.bar;
        this.AuthText = data.data.auth;
        this.init();
        this.getData();
      } else {
        this.$toast(data.msg);
      }
    },
    async getData() {
      let data = await $http.post("plugin.manual-order.frontend.order.index", { order_type: this.tabArr[this.active].order_type, page: this.page, order_sn: this.searchVal });
      if (data.result) {
        this.listInfo = data.data.data;
        this.current_page = data.data.current_page;
        this.isLoadMore = true;
        if (!this.total_page) {
          this.total_page = 0;
        }
      } else {
        this.$toast(data.msg);
      }
    },
    getMoreData() {
      this.isLoadMore = false; // 防止多次请求分页数据
      if (this.page >= this.total_page) {
        this.isLoadMore = false;
        return;
      } else {
        this.isLoading = true;
        this.page = this.page + 1;
        $http
          .get("plugin.manual-order.frontend.order.index", { order_type: this.tabArr[this.active].order_type, page: this.page }, "加载中")
          .then(response => {
            this.isLoadMore = true;
            if (response.result === 1) {
              this.listInfo = this.listInfo.concat(response.data.data);
            } else {
              this.page = this.page - 1;
              this.isLoadMore = false;
              return;
            }
          })
          .catch(err => {
            console.log(err);
          });
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.lis {
  padding: 0.63rem 0.75rem;
  box-sizing: border-box;
}
.textAuth {
  color: #f15353;
  text-align: left;
  margin-left: 0.75rem;
  margin-right: 0.75rem;
  padding: 0.625rem 0;
  .txt_btn{
    margin-right: 0.325rem;
  }
}
</style>
